<template>
  <div class="root">
    <el-tabs v-model="activeName" ; type="card" class="demo-tabs">
      <template v-for="item in tabsOptions" :key="item.code">
       <el-tab-pane :label="item.name" :name="item.code">
        &nbsp;
       </el-tab-pane>
      </template>
    </el-tabs>
  </div>
</template>

<script setup>
import { ref ,onBeforeMount } from "vue";
import{ queryDictChild}from "@/api/dict.js";

const activeName = ref("first");
const tabsOptions = ref([]);

async function queryGroupd() {
  let res = await queryDictChild(0);
  if (res.code == 200) {
    console.log(res.data);
    tabsOptions.value = res.data;
  }
}

onBeforeMount(() => { 

  queryGroupd();
});
</script>

<style scoped>
.root {
  height: 100%;
  background-color: #fff ;
}
</style>
